<template>
    <div class="modal fade" id="CaseMemberSmsListModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" witdh>
        <div class="modal-dialog">
            <div class="modal-content" style="width: 800px">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                    <h4 class="modal-title" id="myModalLabel">驻场人员</h4>
                </div>
                <div class="modal-body">
                    <div class="table-responsive">
                        <div style="text-align: right;margin: 10px 0;"><Icon type="android-alert" color="#f87242" size="18" /> 设置驻场人员不接受短信后，将不会受到任何系统发出的短信</div>
                        <table class="table table-striped table-bordered min-width-790" >
                            <thead>
                            <tr>
                                <th width="7%">序号</th>
                                <th width="15%">部门</th>
                                <th width="20%">驻场人员</th>
                                <th width="25%">联系电话</th>
                                <th width="18%">角色</th>
                                <th width="15%">是否接收短信</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr v-for="(row, index) in premisesCMList">
                                <td>{{index + 1}}</td>
                                <td>{{row.departmentName}}</td>
                                <td>{{row.accountName}}</td>
                                <td>{{row.phone}}</td>
                                <td>{{row.roleName}}</td>
                                <td>
                                    <i-switch   @on-change="function(e){change(e,row.id)}" :disabled="disabled" :value="row.smsStatus == 1" />
                                </td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        //接收父组件的绑定值
        props: ["caseMemberInfo"],
        data(){
            return{
                disabled:false,
                premisesCMList:[]
            }
        },
        watch: {
            //监听父组件绑定值是否改变
            caseMemberInfo: {
                handler: function(val, oldVal){
                    this.initPremisesCM();
                },
                //深层监听，当位对象时，若设为true，属性变更时即可触发，若为false，属性无法监听到
                deep: true
            }
        },
        mounted:function(){

        },
        methods:{
            initPremisesCM: function() {
                var _self = this;
                _self.premisesCMList = [];
                var url = this.utilHelper.apiUrl + "/api/getPremisesCMList";
                var body = {};
                body.params = {
                    premisesId: _self.caseMemberInfo.premisesId
                };
                _self.$http.post(url, body).then((response) => {
                    var resData = response.body.resData;
                    _self.premisesCMList = resData.cmDtoList;
                });
            },
            change:function(status,id){
                this.disabled = true;
                //处理数据
                let params = {
                    caseMemberId: id,
                    smsStatus:status ? 1 : 0
                }
                var _self = this;
                var url = this.utilHelper.apiUrl + "/api/updateCaseMember";
                var body = {params:params};
                _self.$http.post(url, body).then((response) => {
                    var resData = response.body.resData;
                    this.disabled = false;
                    _self.$emit('updateCaseMemberListener');
                });
                console.log(status);
                console.log(id);
            }
        }
    }
</script>

<style scoped>

</style>